<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body style="background-color:'#34c8b2'">
<div id="blog" >
	<div class="container">
		<header class="block-heading cleafix">
			<h1>相册</h1>
			<p>记录点滴~</p>
		</header>
		<section class="block-body" id="xiangcebody">
		<!-- 
			<div class="row">
				<div class="col-sm-4 blog-post">
					<img src="img/bike_water1-1000x600.jpg" alt="Design Your Mind">
					<a href="#"><h2>Design Your Mind</h2></a>
					<div class="date">3 Nov, 2014</div>
				</div>
				<div class="col-sm-4 blog-post">
					<img src="img/mac_glasses1-1000x600.jpg" alt="Winter Is Comming">
					<a href="#"><h2>Winter Is Comming</h2></a>
					<div class="date">3 Nov, 2014</div>
				</div>
				<div class="col-sm-4 blog-post">
					<img src="img/road-1000x600.jpg" alt="The Illustration">
					<a href="#"><h2>The Illustration</h2></a>
					<div class="date">3 Nov, 2014</div>
				</div>
			</div>
		 -->
		</section>
	</div><!--/container-->
</div><!-- /.content-block content-blog-gray -->
</body>
<div th:include="include :: footer"></div>
<script type="text/javascript">
$(function() {
	//ajax获取相册列表
	$.ajax({ url: "/system/photo/list",type:"POST", data:{}, success: function(data){
        //console.info(data);
        //var total=data.total;
        //var rows=data.rows;

        var result = [];
        for(var i=0;i<data.rows.length;i+=3){
            result.push(data.rows.slice(i,i+3));
        }
        var str="";
        for(var i=0;i<result.length;i++){
        	str+='<div class="row">';
        	for(var j=0;j<result[i].length;j++){
        		str+='<div class="col-sm-4 blog-post">'
        		str+='<img src="http://pj6u73y0v.bkt.clouddn.com/'+result[i][j].photocover+'" width="225" height="165">'
        		str+='<a href="viewdetail/'+result[i][j].photoid+'"><h2>'+result[i][j].photoname+'</h2></a>'
        		str+='<div class="date">29 Nov, 2018</div>'
        		str+='</div>'
        	}
        	str+="</div>";
        }
        $("#xiangcebody").html(str);
      }});
	
})

</script>
